<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="sitemesh" uri="http://www.opensymphony.com/sitemesh/decorator" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<%@ taglib prefix="tags" tagdir="/WEB-INF/tags" %>
<script type="text/javascript" src="${ctx}/static/lib/js.extensions/spin.js"></script>
<style type="text/css">
    .ui-datepicker-calendar {
        display: none;
    }

    .ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year {
        width: 44%;
    }

    .ui-progressbar {
        position: relative;
    }
    .progress-label-ie {
        position: absolute;
        left: 50%;
        top: 4px;

    }
</style>
<div class="panel_container">
    <div class="panel">
        <form id="formId" method="post" action="${ctx}/report/generate">
            <div class="panel_header">
                <div><h2>生成上报数据</h2></div>
            </div>
            <div class="panel_body">
                <div>
                    <div>
                        <div class="info_item"><span>请选择业务时间:</span><b>*</b>
                           <input type="text" name="businessDate" maxlength="10" id="businessDate"/>
                        </div>
                    </div>
                    <div>
                        <div class="info_item"><span>请选择业务类型:</span><b>*</b>
                            <input type="checkbox"  name="businessType" value="23"/>信贷业务
                            <input type="checkbox"  name="businessType" value="24"/>贴现业务
                            <input type="checkbox"  name="businessType" value="25"/>银票业务
                            <input type="checkbox"  name="businessType" value="26"/>委托贷款业务
                            <input type="checkbox"  name="businessType" value="27"/>担保业务
                            <input type="hidden" name="businessType" value=""/>
                        </div>
                    </div>
                    <c:if test="${isFh=='true'}">
                        <div>
                            <div class="info_item"><span>请选择业银行:</span>
                                <select name="orgId" id="orgId">
                                    <option value="">--请选择--</option>
                                    <c:forEach var="entry" items="${orgList}">
                                        <option value="${entry.id}" >${entry.orgName}</option>
                                    </c:forEach>
                                </select>
                            </div>
                        </div>
                    </c:if>
                    <c:if test="${isFh=='false'}">
                        <input  name="orgId" type="hidden" value="${orgId}">
                    </c:if>
                    <div>
                        <div id="progressbar" style="display:none"><div class="progress-label-ie">加载。。。</div></div>
                        <div ><div id="message"></div></div>
                    </div>
                </div>
            </div>
            <div class="panel_footer">
                <div>
                    <input type="submit" value="生成" class="btn_blue" id="btn_save"/>
                    <input type="button" style="display:none" onclick="refreshPage()" value="重新生成" class="btn_blue" id="btn_refresh"/>
                    <input type="button" value="上报数据列表" class="btn_blue" id="btn_back"/>
                </div>
            </div>
        </form>
    </div>
</div>
<div id="loader" class="loader" style="display: none"></div>

<script type="text/javascript">

    function refreshPage(){
        linkTo("${ctx}/report/toGenerate");
    }


    function gotoDetailListPage(){
        linkTo("${ctx}/report/toReport");
    }

    function openDialog4Handle(){
        $("#loader").dialog("open");
    }

    function closeDialog4Handle(){
        $("#loader").dialog("close");
    }

    $(function () {

        var data="";
        var progressbar = $( "#progressbar" ),
                progressLabel = $( ".progress-label-ie" );

        progressbar.progressbar({
            value: false,
            change: function() {
                progressLabel.text( progressbar.progressbar( "value" ) + "%" );
            },
            complete: function() {
                progressLabel.text( "完成！" );
                $("#message").empty();
                var  resultMessage =data.split("===") ;
                $("#message").append("查看详细返回信息");
                for(var i=0;i<resultMessage.length-1;i++){
                    $("#message").append("<br>");
                    $("#message").append(i+1).append(". ").append(resultMessage[i]);

                }

                $("#btn_refresh").show();
                $("#btn_save").hide();
            }
        });

        function progress() {
            var val = progressbar.progressbar( "value" ) || 0;
            progressbar.progressbar( "value", val + 1 );
            if ( val < 99 ) {
                setTimeout( progress, 100 );
            }
        }

        $("#businessDate").datepicker({
            defaultDate: "+1w",
            changeYear: true,
            changeMonth: true,
            numberOfMonths: 1,
            dateFormat: "yy-mm",
            onChangeMonthYear: function (year, month, inst) {
                var selected_month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
                var selected_year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
                $(this).datepicker('setDate', new Date(selected_year, selected_month, 1));
            },
            beforeShow: function (input, inst) {
                if ((datestr = $(this).val()).length > 0) {
                    actDate = datestr.split('-');
                    year = actDate[0];
                    month = actDate[1] - 1;
                    $(this).datepicker('option', 'defaultDate', new Date(year, month));
                    $(this).datepicker('setDate', new Date(year, month));
                }
            }
        });

        if($('#businessDate').val()==""){
            var curDate = new Date();
            var preDate = new Date(curDate.getFullYear(),curDate.getMonth()-1,curDate.getDay());
            $('#businessDate').val(preDate.format("yyyy-MM"));
        }

        $("#btn_back").bind("click",gotoDetailListPage);

        $("#formId").validate({
            rules:{
                businessDate: "required",
                businessType: "required"
            },
            messages:{
                businessDate: "业务时间必填",
                businessType: "业务类型必选"
            },
            submitHandler: function(form) {
                $(form).ajaxSubmit({
                    beforeSubmit:function(){
                        $("#progressbar").show();
                    },
                    success: function (response) {
                        data = $.parseJSON(response).message;
                        progress();
                    },

                    error: function(response){
                        $.prompt("保存失败:"+response,"错误");
                    }
                });
            }
        });

    });

</script>

